<template>
    <div class="container">

      <!-- 头部 -->
      <div class="header">
        <!-- 报价型体型作业 -->
        <el-card class="headerBodily" shadow="always">
          <div slot="header">
            <span>报价形体作业</span>
          </div>
          <!-- card body -->
        </el-card>

        <!-- 头部中间 -->
        <div class="headerMiddle">
          <!-- 形体基本资料 -->
        <el-card class="headerPhysique" shadow="always" >
          <div slot="header">
            <span>形体基本资料</span>
          </div>
          <!-- card body -->
        </el-card>

        <!-- 报价检核作业 -->
        <el-card class="headerCheck" shadow="always" >
          <div slot="header">
            <span>报价检核作业</span>
          </div>
          <!-- card body -->
        </el-card>

        <!-- 报价资料作业 -->
        <el-card class="headerMaterial" shadow="always" >
          <div slot="header">
            <span>报价资料作业</span>
          </div>
          <!-- card body -->
        </el-card>
        </div>
        
        <!-- 报价项目明确 -->
        <el-card class="headerProject" shadow="always" >
          <div slot="header">
            <span>报价项目明确</span>
          </div>
          <!-- card body -->
        </el-card>
      </div>
      
      <!-- 主体 -->
      <div class="Main">

        <!-- 报价形体资料 -->
        <el-card class="MainProject" shadow="always" >
          <div slot="header">
            <span>报价形体资料</span>
          </div>
          <!-- card body -->
        </el-card>

         <!-- 新增报价材料 -->
         <el-card class="MainNewly" shadow="always" >
          <div slot="header">
            <span>报价项目明确</span>
          </div>
          <!-- card body -->
        </el-card>
      </div>
    </div>
</template>
<script lang="ts">
  import { defineComponent } from 'vue';
  export default defineComponent({
    name:'Job'
  })
</script>
<script lang="ts" setup>
</script>

<style lang="less" scoped>
// 总体
.container{
  width: 99.8%;
  margin: auto;
  box-shadow: none;
}

// 头部
.header{
  width: 100%;
  height: 170px;
  display: flex;
  flex-wrap: wrap;
  height: 100%;
}

// 中间
.headerMiddle{
  width: 1013px;
  display: flex;
  flex-wrap: wrap;
}

// 报价体型
.headerBodily{
  width: 340px;
  height: 152px;
  box-shadow: none;
}

// 形体基本资料
.headerPhysique{
  width: 1013px;
  height: 70px;
  box-shadow: none;
  margin-left: 10px;
  box-shadow: none;
}

// 报价检核作业
.headerCheck{
  width: 49%;
  height: 70px;
  margin-left: 10px;
  margin-top: 10px;
  box-shadow: none;
}

//报价资料作业
.headerMaterial{
  width: 49%;
  height: 70px;
  margin-left: 10px;
  margin-top: 10px;
  box-shadow: none;
}

// 形体基本i了
.headerProject{
  width: 301px;
  height: 152px;
  margin-left: 10px;
  box-shadow: none;
}

// 主体
.Main{
  width: 100%;
  height: 50px;
  margin-top: 10px;
  display: flex;
}

// 左侧报价形体资料
.MainProject{
  width: 340px;
  height: 631px;
  box-shadow: none;
}

// 新增报价材料
.MainNewly{
  width: 1320px;
  height: 629px;
  margin-left: 10px;
  box-shadow: none;
}
</style>
